{literal}
<style>
	.ph{
		border: 1px solid #999;
		float: left;
		height: 26px;
		margin-right: 4px;
	}
</style>
<script>
	$(document).ready(function(){
		$('#main-menu-items, #bottom-menu-items, #hidden-menu-items').sortable({
			placeholder: 'ph',
			tolerance: 'pointer',
			connectWith: '#main-menu-items, #bottom-menu-items, #hidden-menu-items',
			start:	function(event, ui){
				$(ui.placeholder).width($(ui.item).width());
			},
			stop:	function(event, ui){

			},
			recieve:	function(event, ui){},
			update:	function(event, ui){
				if(ui.sender){
					return;
				}

				var set = {};
				$('.ow_navbox', '#main-menu-items').each(function(i){
					set['main-menu['+i+']'] = $('input:hidden', this).val();
				});

				$('.ow_navbox', '#bottom-menu-items').each(function(i){
					set['bottom-menu['+i+']'] = $('input:hidden', this).val();
				});

				$('.ow_navbox', '#hidden-menu-items').each(function(i){
					set['hidden-menu['+i+']'] = $('input:hidden', this).val();
				});

				var url = '{/literal}{url_for for='ADMIN_CTRL_Pages:ajaxReorder'}{literal}';
				$.post(url, set);
			}
		});
	});
</script>
{/literal}

<p>{text key='admin+pages_and_menus_instructions'}</p>

<!-- Std block for page -->
{block_decorator name='box_cap' type='empty' iconClass='ow_ic_folder' langLabel='admin+pages_and_menus_main_menu_label'}{/block_decorator}
{block_decorator name='box' type='empty' addClass='ow_stdmargin clearfix'}
    <div class="ow_main_menu_scheme"></div>
    <div id="main-menu-items" style="width: 650px; height: 100px;" class="ow_left clearfix ow_box_empty">
	{foreach from=$menuItems.main item='menu'}
		{literal}
			<script>
				$(document).ready(function(){
					$('#menu-{/literal}{$menu.id}{literal}').hover( function(){$('#edit-link-{/literal}{$menu.id}{literal}').show();}, function(){ $('#edit-link-{/literal}{$menu.id}{literal}').hide(); } );
				});			 
			</script>
		{/literal}
					{if $menu.externalUrl}
						{assign var='route' value='admin_pages_edit_external'}
					{elseif $menu.routePath }
						{assign var='route' value='admin_pages_edit_plugin'}
					{else}
						{assign var='route' value='admin_pages_edit_local'}
					{/if}
					
			<div id="menu-{$menu.id}" class="ow_navbox {if $menu.visibleFor == 1}ow_mild_red{elseif $menu.visibleFor == 2}ow_mild_green{/if}">
				<div id="edit-link-{$menu.id}" style="background-color: #999; font-weight: bold; display: none; position:absolute; margin-top: -15px; padding: 0px 3px;">
					<a style="color: white;" href="{url_for_route for="`$route`:[id=>`$menu.id`]"}">edit</a>
				</div>
	        	<input type="hidden" value="{$menu.id}">
	            <a class="move" href="#">{text key="`$menu.prefix`+`$menu.key`"}</a>
	        </div>
	{foreachelse}
		<div class="empty_" style="text-align: center; display: none;">drag here..</div>        
	{/foreach}
    </div>
    <div class="ow_right ow_txtright">
    	{capture assign="add_main"}{url_for_route for="admin_pages_add:[type=>main]"}{/capture}

    	{decorator name="button" class="ow_ic_add" langLabel="base+pages_add_item" onclick="location.href='`$add_main`';"}
    </div>
{/block_decorator}

<!-- End of STD block -->

{block_decorator name='box_cap' type='empty' iconClass='ow_ic_folder' langLabel='admin+pages_and_menus_bottom_menu_label'}{/block_decorator}
{block_decorator name='box' type='empty' addClass='ow_stdmargin clearfix'}
    <div class="ow_bottom_menu_scheme"></div>
    <div id="bottom-menu-items" style="width: 650px; height: 100px;" class="ow_left clearfix ow_box_empty">
    {if $menuItems.bottom|@count} 
		{foreach from=$menuItems.bottom item='menu'}
		
			{literal}
				<script>
					$(document).ready(function(){
						$('#menu-{/literal}{$menu.id}{literal}').hover( function(){$('#edit-link-{/literal}{$menu.id}{literal}').show();}, function(){ $('#edit-link-{/literal}{$menu.id}{literal}').hide(); } );
					});			 
				</script>
			{/literal}
					{if $menu.externalUrl}
						{assign var='route' value='admin_pages_edit_external'}
					{elseif $menu.routePath }
						{assign var='route' value='admin_pages_edit_plugin'}
					{else}
						{assign var='route' value='admin_pages_edit_local'}
					{/if}
					
	        <div id="menu-{$menu.id}" class="ow_navbox {if $menu.visibleFor == 1}ow_mild_red{elseif $menu.visibleFor == 2}ow_mild_green{/if}">
	        	<div id="edit-link-{$menu.id}"  style=" background-color: #999; color: #fff;font-weight: bold; display: none; position:absolute; margin-top: -15px; padding: 0px 3px;">
	        		<a style="color: white;" href="{url_for_route for="`$route`:[id=>`$menu.id`]"}">
	        			edit
        			</a>
       			</div>
		        <input type="hidden" value="{$menu.id}">
		    	<a class="move" href="#">{text key="`$menu.prefix`+`$menu.key`"}</a>
		    </div>
		{/foreach}
	{else}
		<div class="empty_" style="display: none;">drag here..</div>
    {/if}
    </div>
    	{capture assign="add_bottom"}{url_for_route for="admin_pages_add:[type=>bottom]"}{/capture}
    	&nbsp;&nbsp;&nbsp;{decorator name="button" class="ow_ic_add" langLabel="base+pages_add_item" onclick="location.href='`$add_bottom`';"}    
{/block_decorator}

{block_decorator name='box_cap' iconClass='ow_ic_delete' langLabel='admin+pages_and_menus_hidden_pages_label'}{/block_decorator}
{block_decorator name='box' addClass='ow_stdmargin'}
    <div class="clearfix">
    <div id="hidden-menu-items" class="ow_stdmargin clearfix ow_center ow_nomargin" style="height:25px;">
	    {if $menuItems.hidden|@count}
			{foreach from=$menuItems.hidden item='menu'}

					{literal}
						<script>
							$(document).ready(function(){
								$('#menu-{/literal}{$menu.id}{literal}').hover( function(){$('#edit-link-{/literal}{$menu.id}{literal}').show();}, function(){ $('#edit-link-{/literal}{$menu.id}{literal}').hide(); } );
							});			 
						</script>
					{/literal}
			
					{if $menu.externalUrl}
						{assign var='route' value='admin_pages_edit_external'}
					{elseif $menu.routePath }
						{assign var='route' value='admin_pages_edit_plugin'}
					{else}
						{assign var='route' value='admin_pages_edit_local'}
					{/if}
		        <div id="menu-{$menu.id}" class="ow_navbox {if $menu.visibleFor == 1}ow_mild_red{elseif $menu.visibleFor == 2}ow_mild_green{/if}">
		        	<div id="edit-link-{$menu.id}" style="background-color: #999999; color: #fff;font-weight: bold; display: none; position:absolute; margin-top: -15px; padding: 0px 3px;">
		        		<a style="color: white;" href="{url_for_route for="`$route`:[id=>`$menu.id`]"}">
		        			edit
	        			</a>
	       			</div>
			        <input type="hidden" value="{$menu.id}">
			    	<a class="move" href="#">{text key="`$menu.prefix`+`$menu.key`"}</a>
			    </div>
			{/foreach}
		{else}
			<div class="empty_" style="display: none;">drag here..</div>
	    {/if}
	</div>
        </div>
    <p>{text key='admin+pages_and_menus_hidden_desc'}</p>
	
{/block_decorator}	

{block_decorator name='box_cap' iconClass='ow_ic_help' langLabel='admin+pages_and_menus_legend_label'}{/block_decorator}
{block_decorator name='box' addClass='ow_stdmargin'}
	<div class="clearfix"><div class="ow_navbox"><b>{text key='admin+pages_and_menus_item_label'}</b></div> - {text key='admin+pages_and_menus_legend_everyone_label'}</div>
	<div class="clearfix"><div class="ow_navbox ow_mild_red"><b>{text key='admin+pages_and_menus_item_label'}</b></div> - {text key='admin+pages_and_menus_legend_guests_label'}</div>
	<div class="clearfix"><div class="ow_navbox ow_mild_green"><b>{text key='admin+pages_and_menus_item_label'}</b></div> - {text key='admin+pages_and_menus_legend_members_label'}</div>
{/block_decorator}